<template lang="pug">
.ui.icon.input
  input(type='text', placeholder='搜索', v-model="keyword", @keyup.enter="load")
  i.remove.link.icon(v-if="keyword && keyword.length > 0", @click="keyword=null")
</template>

<script>
export default {
  name: 'search',
  props: ['keyword', 'load'],
  watch: {
    keyword: {
      handler (val, old) {
        if (_.isFunction(this.load) && (!val ||val.length === 0) && old && old.length > 0) {
          this.load()
        }
      },
      deep: true,
    },
  },
}
</script>

<style lang="sass">
</style>
